<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
      layout:decorate="~{layout/main}">
<head>
    <title>个人资料</title>
</head>
<body>
    <div layout:fragment="title">个人资料</div>
    
    <div layout:fragment="content">
        <div class="row">
            <div class="col-lg-8 mx-auto">
                <div class="card shadow">
                    <div class="card-header bg-primary text-white">
                        <h5 class="mb-0">我的基本信息</h5>
                    </div>
                    <div class="card-body">
                        <div class="text-center mb-4">
                            <img src="https://github.com/mdo.png" alt="用户头像" class="rounded-circle img-fluid"
                                 style="width: 120px; height: 120px; object-fit: cover;">
                        </div>
                        <div class="row mb-3">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label">用户名</label>
                                    <input type="text" class="form-control" th:value="${user.username}" readonly>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label">姓名</label>
                                    <input type="text" class="form-control" th:value="${user.name}" readonly>
                                </div>
                            </div>
                        </div>

                        <div class="row mb-3">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label">电话</label>
                                    <input type="text" class="form-control" th:value="${user.phone}" readonly>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label">邮箱</label>
                                    <input type="email" class="form-control" th:value="${user.email}" readonly>
                                </div>
                            </div>
                        </div>

                        <div class="row mb-3">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label">账户角色</label>
                                    <input type="text" class="form-control" 
                                           th:value="${user.role == 'ADMIN' ? '管理员' : '普通用户'}" readonly>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label">账户状态</label>
                                    <input type="text" class="form-control" 
                                           th:value="${user.active ? '正常' : '已禁用'}" readonly>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <div layout:fragment="page_scripts">
        <!-- 页面特定的JavaScript -->
    </div>
</body>
</html> 